<template>
  <div class="item-block">
    <!-- <div class="title">订单信息</div> -->
    <div class="price-con">
      <div class="label">商品总额</div>
      <div class="line-detail">
        <span>¥ {{(detail.total_fee).toFixed(2)}}</span>
      </div>
    </div>
    <div class="price-con" v-if="detailAll.superior_dls_name">
      <div class="label">一级代理商</div>
      <div class="line-detail">{{detailAll.superior_dls_name}}</div>
    </div>
    <div class="price-con" v-if="detail.coupon_fee>0">
      <div class="label">{{detailAll.ftitle_coupon_name}}</div>
      <div class="line-detail">-{{mSymbol.name}}{{detail.coupon_fee}}</div>
    </div>
    <div class="price-con" v-if="detail.coupon_code_fee>0">
      <div class="label">{{detailAll.coupon_code_alias}}</div>
      <div class="line-detail">-{{mSymbol.name}}{{detail.coupon_code_fee}}</div>
    </div>
    <div class="price-con" v-if="detail.first_remission_price>0">
      <div class="label">首单立减</div>
      <div class="line-detail">{{detail.first_remission_price}}</div>
    </div>
    <div class="price-con" v-if="detailAll.subtract_msg">
      <div class="label">活动优惠</div>
      <div class="line-detail">{{detailAll.subtract_msg}}</div>
    </div>
    <div class="price-con">
      <div class="label">运费</div>
      <div class="line-detail" v-if="detailAll.freight_payer4==1">到付</div>
      <div class="line-detail" v-else>
        <span v-if="detail.pay_type==5">&dollar;</span>
        <span v-else>{{mSymbol.name}}</span>
        <span v-if="detail.freight_collect_fee>0">{{detail.freight_collect_fee}}（到付）</span>
        <span v-else>{{detail.post_fee || '0.00'}}</span>
      </div>
    </div>
    <div class="price-con" v-if="detail.tax_fee>0 || detail.tax_invoice_fee>0">
      <div class="label">{{detailAll.taxes_alias}}</div>
      <div class="line-detail">{{mSymbol.name}} {{(+detail.tax_fee + +detail.tax_invoice_fee).toFixed(2)}}</div>
    </div>
    <div class="price-con" v-if="detailAll.freight_insurance">
      <div class="label">{{detailAll.freight_insurance_name}}</div>
      <div class="line-detail">{{detailAll.freight_insurance}}</div>
    </div>
    <div class="price-con" v-if="detail.point_fee">
      <div class="label">{{detailAll.point_name}}抵现</div>
      <div class="line-detail" v-if="detail.pay_type==5">&dollar;{{detail.point_fee}}</div>
      <div class="line-detail" v-else>{{mSymbol.name}}{{detail.point_fee}}</div>
    </div>
    <div class="price-con" v-if="detail.virtual_currency_fee>0">
      <div class="label">虚拟币抵现</div>
      <div class="line-detail" v-if="detail.pay_type==5">&dollar;{{detail.virtual_currency_fee}}</div>
      <div class="line-detail" v-else>&yen; {{detail.virtual_currency_fee}}</div>
    </div>
    <div class="total-price">
      <span v-if="detail.pay_time">实付款</span>
      <span v-else>应付款</span>
      <span v-if="detailAll.freight_payer4!=1 && detail.freight_collect_fee==0">：</span>
      <span v-else>(不含运费)：</span>
      <span class="price" v-if="detail.pay_type==5">&dollar;{{detail.payment}}</span>
      <span class="price" v-else v-html="scaleGoodsPriceFn(detail.payment)"></span>
    </div>  
  </div>
</template>

<script>
import Vue from 'vue'
import { scaleGoodsPrice } from '@/utils/index.js'
import { mapGetters } from 'vuex'
export default Vue.extend({
  props: {
    detailAll: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  methods: {
    scaleGoodsPriceFn(price) {
      return scaleGoodsPrice(price)
    },
    _toFixed(num) {
      return num ? (+num).toFixed(2) : '0.00'
    }
  },
  computed: {
    detail() {
      return this.detailAll.detail
    },
    totalText() {
      const text1 = `${
        this.detailAll.order_detail.pay_time ? '实付款' : '应付款'
      }`
      let text2 = ''
      if (
        this.detailAll.freight_payer4 != 1 &&
        this.detail.freight_collect_fee == 0
      ) {
        text2 = '：'
      } else {
        text2 = '(不含运费)：'
      }
      return text1 + text2
    },
    // 获取自定义符号
    ...mapGetters(['mSymbol'])

  }
})
</script>

<style lang="scss">
@import "src/styles/order/detail";
</style>